#{extends 'CRUD/layout.html' /}
#{set title:messages.get('crud.blank.title', type.modelName) /}

<div id="crudBlank" class="${type.name}">

    <h2 id="crudBlankTitle">&{'crud.blank.title', type.modelName}</h2>
	<div id="map" style="height:250px;width:350px;"></div>
	
 <script type="text/javascript">
	var map = L.map('map', {
	    center: [48.904, 2.2135],
	    zoom: 16
	});
	L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
	    maxZoom: 19
	}).addTo(map);
	
	var marker = L.marker([48.904124, 2.213852],{draggable: true}).addTo(map);
	
	$(document).ready(function() {
		marker.on('dragend', function(e) {
			var lat = marker.getLatLng().lat;
			var lng = marker.getLatLng().lng;
	 		$('input[id=object_latitude]').val(lat);
	 		$('input[id=object_longitude]').val(lng);
		});
	});
</script>
    <div class="objectForm">
    #{form action:@create(), enctype:'multipart/form-data'}
        #{crud.form}
        #{crud.custom 'latitude'}
        <label for="latitude">
            &{'latitude'}
        </label>
        <input  id="object_latitude" type="text" name="object.latitude" value="" size="8" />
    #{/crud.custom}
          
     #{crud.custom 'longitude'}     
           <label for="longitude">
            &{'longitude'}
        </label>
        <input  id="object_longitude" type="text" name="object.longitude" value="" size="8" />
    #{/crud.custom}
    #{/crud.form}  
    
        <p class="crudButtons">
            <input type="submit" name="_save" value="&{'crud.save', type.modelName}" />
            <input type="submit" name="_saveAndContinue" value="&{'crud.saveAndContinue', type.modelName}" />
            <input type="submit" name="_saveAndAddAnother" value="&{'crud.saveAndAddAnother', type.modelName}" />
        </p>
    #{/form}
    </div>

</div>